import React, { Component } from 'react'
import { Carousel } from 'antd-mobile'
import swiper01 from 'assets/swiper01.jpg'
import swiper02 from 'assets/swiper02.jpg'
import swiper03 from 'assets/swiper03.jpg'
import swiper04 from 'assets/swiper04.jpg'
export default class Swiper extends Component {
  state = {
    data: [swiper01, swiper02, swiper03,swiper04]
  }
  render() {
    return (
      
        <Carousel
          autoplay={true}
          infinite
          beforeChange={(from, to) => console.log(`slide from ${from} to ${to}`)}
          afterChange={index => console.log('slide to', index)}
        >
             {this.state.data.map(val => (
              <img
                src={val}
                alt=""
                style={{ width: '100%', height:'200px',verticalAlign: 'top' }}
                onLoad={() => {
                  // fire window resize event to change height
                  window.dispatchEvent(new Event('resize'));
                  this.setState({ imgHeight: 'auto' });
                }}
              />
          ))}
        </Carousel>
    
    )
  }
}
